<template>
  <van-nav-bar title="订单评价" left-arrow @click-left="back" />
  <section class="aui-flexView">
    <!-- 订单详细 -->
    <section class="aui-scrollView">
      <!-- 订单状态 -->
      <div class="aui-pay-change">
        <div class="aui-flex">
          <div class="aui-flex-box">
            <h3>{{ info.status_text }}</h3>
          </div>
          <div class="aui-pay-zfb">
            <img src="/assets/images/icon-zfb.png" alt="" />
          </div>
        </div>
      </div>
      <!-- 评价内容 -->
      <van-form @submit="onSubmit">
        <van-cell-group inset>
          <van-field name="rate" label="评分" :rules="[{ required: true, message: '请填写评分' }]">
            <template #input>
              <van-rate v-model="rate" icon="star" void-icon="star-o" allow-half />
            </template>
          </van-field>
          <van-field v-model="comment" rows="2" autosize label="评价内容" type="textarea" maxlength="120"
            placeholder="请输入评价内容" show-word-limit />
          <van-field name="proimg" label="评价图片">
            <template #input>
              <van-uploader v-model="fileList" :max-count="5" multiple />
            </template>
          </van-field>
        </van-cell-group>
        <div style="margin: 16px">
          <van-button round block type="primary" native-type="submit"> 提交 </van-button>
        </div>
      </van-form>
    </section>
  </section>
</template>
<script setup>
const { proxy } = getCurrentInstance();
const back = () => proxy.$router.push("/order/index");
let business = proxy.$cookies.get("business") ? proxy.$cookies.get("business") : {};
business = reactive(business);

let orderid = proxy.$route.query.hasOwnProperty("orderid")
  ? proxy.$route.query.orderid
  : 0;
orderid = ref(orderid);

let orderproid = proxy.$route.query.hasOwnProperty("orderproid")
  ? proxy.$route.query.orderproid
  : 0;
orderproid = ref(orderproid);
const info = ref({});
const rate = ref("");
const comment = ref("");
const fileList = ref([]);
const RequestData = ref(new FormData());
onBeforeMount(() => {
  getInfoData();
});
const getInfoData = async () => {
  let result = await proxy.$POST({
    url: "/order/info",
    params: {
      orderid: orderid.value,
      busid: business.id,
    },
  });
  if (result && result.code == 1) {
    info.value = result.data;
  }
};
const onSubmit = async (values) => {
  RequestData.value = new FormData();
  RequestData.value.append("busid", business.id);
  RequestData.value.append("orderid", orderid.value);
  RequestData.value.append("orderproid", orderproid.value);
  RequestData.value.append("rate", rate.value);
  RequestData.value.append("comment", comment.value);
  if (values.proimg.length > 0) {
    values.proimg.forEach((item) => {
      RequestData.value.append(orderproid.value + "[]", item.file);
    });
  }
  let result = await proxy.$POST({
    url: "/order/rate",
    params: RequestData.value,
  });
  if (result.code == 0) {
    proxy.$fail(result.msg);
    return false;
  } else {
    proxy.$success({
      message: result.msg,
      duration: 1000,
      onClose: () => {
        proxy.$router.push("/order/index");
        return false;
      },
    });
  }
};
</script>
